<template>
    <div class="main-container"  :class="wrap?'main-wrap-container':'main-no-wrap-container'" id="search-mixin-id">
    <main-content :title="contentTitle" >
        <div slot="search"  v-if="showSearchBox">
          <SearchBox 
            v-if="showSearchBox"
            :searchParamsList="searchParamsList" 
            :searchParam.sync="searchParam" 
            @searchBoxParams="searchClick" 
            @searchReset="searchReset" 
            ></SearchBox> 
        </div>
        <div slot="table">
        <!-- 在此处放置表格内容 -->
            <avue-crud ref="service_contractTable" :data="listData" :showColumn="showColumn" :isSaveColumns="true" @selection-change="selectionChange" id="printTable" :option="option" stripe :page.sync="page"
                       @on-load="onPageLoad"
                       @row-dblclick="handleRowDBLClick"
                       @sort-change="sortChange" 
                       @current-row-change="handleCurrentRowChange" >
                <template slot-scope="scope" slot="menu">
		  			   <template slot-scope="scope" slot="menu">
		  			       <el-button type="opr-primary" size="mini"  icon="el-icon-view"  v-if="hasBtns('service_contract:view')&&hasButtonPermission('service_contract:view')" @click="viewForm(scope.row)">{{$t("crud.viewBtn")}}</el-button>
		  			       <el-button type="opr-primary" size="mini"  icon="el-icon-edit" v-if="hasBtns('service_contract:modify')&&hasButtonPermission('service_contract:modify')&&scope.row.audit_state == '审核不通过' || scope.row.audit_state == '未审核'" @click="editForm(scope.row)">{{$t("crud.editBtn")}}</el-button>
		  			       <!-- <el-button type="opr-primary" size="mini"  icon="el-icon-delete" v-if="hasBtns('SalesContract:delete')&&hasButtonPermission('SalesContract:delete')" @click="deleteForm(scope.row)">{{$t("crud.delBtn")}}</el-button> -->
		  			   </template>
                </template>
                 <template slot="menuLeft">
                     <el-button type="primary"  v-if="hasButtonPermission('service_contract:add')" icon="el-icon-plus" size="small" @click="openForm()">{{$t("crud.addBtn")}}</el-button>
                     <!-- <el-button type="primary"  v-if="hasButtonPermission('service_contract:batchDelete')" icon="el-icon-delete" size="small" @click="batchDelete()">{{$t("forme.editModal.batchDeletionBtn")}}</el-button> -->
                     <el-button type="primary"  v-if="hasButtonPermission('service_contract:print')" icon="el-icon-printer" size="small" @click="printForm">{{$t("editorModule.print")}}</el-button>
                </template>
            </avue-crud>
            <el-dialog title="表单"  v-dialogDrag :append-to-body="true" :fullscreen="true" :visible.sync="flag"  :class="isWorkflowForm ? 'work-form-dialog' : ''" :show-close="!isWorkflowForm" >
                <service_contractForm ref="xtForm"  v-if="flag"  :isEdit="isEdit" :disabled="disabled" @onChange="dialogChange" :keyValue="keyValue"></service_contractForm>
            </el-dialog>
        </div>
    </main-content>
    <createFlow v-if="isCreateFlow" formType="2" rowPrimaryKey="id" :UrlAddress="this.$options.name" :createFlowType="createFlowType" :row="scopeRow" :scheme="scheme" @closedCreateFlow="closedCreateFlow"></createFlow>
    </div>
</template>
<script>
      import createFlow from '@/components/formInitiationProcess/createFlow';
      import schemeMixins from '@/components/formInitiationProcess/schemeMixins';
     import MainFixed from "@/page/main/MainFixed";
      import authorizeMixin from "@/mixins/authorize";
      import tableOptionMixin from "@/mixins/tableOption"; //table 高度计算
      import tableSearchMixin from "@/mixins/tableSearch"; //table 搜索 
      import displayColumnsMixin from "@/mixins/displayColumns"; //表格展示列显隐保存 
     import MainContent from "@/page/main/MainContent";
      import request from '@/router/axios';
      import { baseUrl } from '@/config/env';
      import { getOrder } from '@/util/util';
      import service_contractForm from './service_contractForm';
     export default {
         name: "service_contract",
         mixins: [authorizeMixin,tableOptionMixin,tableSearchMixin,displayColumnsMixin,schemeMixins],
         components: { MainContent, service_contractForm,createFlow,MainFixed },
         data() {
              return {
				 	  btns:[
				 	     'service_contract:refresh',
				 	     'service_contract:add',
				 	     'service_contract:view',
				 	     'service_contract:modify',
				 	     'service_contract:delete',
				 	     'service_contract:batchDelete',
				 	     'service_contract:print'
                   ],
                   page: {
                       pageSize: 20,
                       total: 0,
                       currentPage: 1,
                       layout: "total, prev, pager, next, jumper"
                   },
                   ids: '',
                   listData: [],
                   keyValue: '',
                   flag:false,
                   isEdit: true, // 查看-不显示按钮,
                   disabled: false, // 查看-禁用input,
                   isWorkflowForm:false,//默认值 false
                   defaultOrderfield:'',//默认排序字段
                   defaultOrder:'',//默认排序
                   searchParam: {},
                   defaultProps: {
                       children: 'children',
                       label: ''
                   },
                   option:{
                       rowKey:'id',
                       highlightCurrentRow: true,
                       stripe: true,
                       addBtn: false,
                       tip:false,
                       menuWidth: 230,
                       border: true,
                       page: true,
                       selection: true,
                       index: true,
                       menu: false,
                       indexLabel: this.$t('custmerForm.tableNumber'),
                       align: 'center',
                       menuAlign: 'left',
                       delBtn: false,
                       editBtn: false,
                       column: [
                           {
                               sortable: true,
                               label: this.$t("订单编号"),
                               prop: 'order_id',
                               overHidden: true,
                           },
                           {
                               sortable: true,
                               label: this.$t("服务编号"),
                               prop: 'service_number',
                               overHidden: true,
                           },
                           {
                               sortable: true,
                               label: this.$t("组件名称"),
                               prop: 'assembly_id',
                               overHidden: true,
                           },
                           {
                               sortable: true,
                               label: this.$t("客户名称"),
                               prop: 'customer_id',
                               overHidden: true,
                           },
                           // {
                           //     sortable: true,
                           //     label: this.$t("客户编码"),
                           //     prop: 'customer_code',
                           //     overHidden: true,
                           // },
                           // {
                           //     sortable: true,
                           //     label: this.$t("联系人id"),
                           //     prop: 'contactor_id',
                           //     overHidden: true,
                           // },
                           {
                               sortable: true,
                               label: this.$t("联系人姓名"),
                               prop: 'contactor_name',
                               overHidden: true,
                           },
                           {
                               sortable: true,
                               label: this.$t("联系人电话"),
                               prop: 'contactor_phone',
                               overHidden: true,
                           },
                           {
                               sortable: true,
                               label: this.$t("订单签订日期"),
                               prop: 'create_date',
                               overHidden: true,
                           },
                           // {
                           //     sortable: true,
                           //     label: this.$t("销售部门id"),
                           //     prop: 'sales_department_id',
                           //     overHidden: true,
                           // },
                           {
                               sortable: true,
                               label: this.$t("销售方名称"),
                               prop: 'sales_man_id',
                               overHidden: true,
                           },
                           {
                               sortable: true,
                               label: this.$t("销售合同名称"),
                               prop: 'contract_name',
                               overHidden: true,
                           },
                           {
                               sortable: true,
                               label: this.$t("服务开始日期"),
                               prop: 'contract_start_date',
                               overHidden: true,
                           },
                           {
                               sortable: true,
                               label: this.$t("服务结束日期"),
                               prop: 'contract_end_date',
                               overHidden: true,
                           },
                           {
                               sortable: true,
                               label: this.$t("含税金额"),
                               prop: 'tax_amount',
                               overHidden: true,
                           },
                           {
                               sortable: true,
                               label: this.$t("不含税金额"),
                               prop: 'none_tax_amount',
                               overHidden: true,
                           },
                           // {
                           //     sortable: true,
                           //     label: this.$t("合同主要内容说明"),
                           //     prop: 'contract_instruction',
                           //     overHidden: true,
                           // },
                           // {
                           //     sortable: true,
                           //     label: this.$t("其他说明"),
                           //     prop: 'commentss',
                           //     overHidden: true,
                           // },
                           {
                               sortable: true,
                               label: this.$t("审阅结果"),
                               prop: 'audit_state',
                               overHidden: true,
                           },
                           {
                               sortable: true,
                               label: this.$t("审阅人"),
                               prop: 'auditor_id',
                               overHidden: true,
                           },
                           {
                               sortable: true,
                               label: this.$t("审核日期"),
                               prop: 'audit_date',
                               overHidden: true,
                           },
                           // {
                           //     sortable: true,
                           //     label: this.$t("不通过原因"),
                           //     prop: 'reject_reason',
                           //     overHidden: true,
                           // },
                           // {
                           //     sortable: true,
                           //     label: this.$t("合同状态"),
                           //     prop: 'contract_state',
                           //     overHidden: true,
                           // },
                       ]
                   }
              }
                   },
                   created() {
                       //是否有编辑 查看 删除 发起流程 发起临时流程权限 无则为操作列不显示
                       let oprBtns = ['service_contract:modify','service_contract:view','service_contract:delete','service_contract:createFormFlow','service_contract:createDesignFlow'];
                       let intersection = this.btns.filter((v) => oprBtns.includes(v)); 
                       if(intersection.length>0){
                       	this.option.menu =  true
                       }else{
                       	this.option.menu = false
                       }
                       let querySearchData = [
                       	{ 
                       		name: '订单编号', 
                       		DateField: '', 
                       		field: 'order_id', 
                       		tag: 'el-select', 
                       		avueType: 'select', 
                       		lgmark: '', 
                       		dataType: 'dataSource', 
                       		dataSource: '088300080f8054153a7cd61e7a22cdb2', 
                       		saveField: 'id', 
                       		showField: 'id', 
                       	}, 
                       	{ 
                       		name: '服务编号', 
                       		DateField: '', 
                       		field: 'service_number', 
                       		tag: 'el-input', 
                       		avueType: 'input-tip', 
                       		lgmark: '', 
                       	}, 
                       	{ 
                       		name: '组件名称', 
                       		DateField: '', 
                       		field: 'assembly_id', 
                       		tag: 'el-input', 
                       		avueType: 'input-tip', 
                       		lgmark: '', 
                       	}, 
                       	{ 
                       		name: '客户名称', 
                       		DateField: '', 
                       		field: 'customer_id', 
                       		tag: 'el-input', 
                       		avueType: 'input-tip', 
                       		lgmark: '', 
                       	}, 
                       	// { 
                       	// 	name: '客户编码', 
                       	// 	DateField: '', 
                       	// 	field: 'customer_code', 
                       	// 	tag: 'el-input', 
                       	// 	avueType: 'input-tip', 
                       	// 	lgmark: '', 
                       	// }, 
                       	// { 
                       	// 	name: '联系人id', 
                       	// 	DateField: '', 
                       	// 	field: 'contactor_id', 
                       	// 	tag: 'el-input', 
                       	// 	avueType: 'input-tip', 
                       	// 	lgmark: '', 
                       	// }, 
                       	{ 
                       		name: '联系人姓名', 
                       		DateField: '', 
                       		field: 'contactor_name', 
                       		tag: 'el-input', 
                       		avueType: 'input-tip', 
                       		lgmark: '', 
                       	}, 
                       	// { 
                       	// 	name: '联系人电话', 
                       	// 	DateField: '', 
                       	// 	field: 'contactor_phone', 
                       	// 	tag: 'el-input', 
                       	// 	avueType: 'input-tip', 
                       	// 	lgmark: '', 
                       	// }, 
                       	{ 
                       		name: '订单签订日期', 
                       		DateField: '', 
                       		field: 'create_date', 
                       		tag: 'el-date-picker', 
                       		avueType: 'datetime', 
                       		lgmark: '', 
                       		"type": "date",
                       		"format": "yyyy-MM-dd",
                       		"value-format": "yyyy-MM-dd",
                       	}, 
                       	// { 
                       	// 	name: '销售部门id', 
                       	// 	DateField: '', 
                       	// 	field: 'sales_department_id', 
                       	// 	tag: 'avue-load-tree', 
                       	// 	avueType: 'load-tree', 
                       	// 	lgmark: '', 
                       	// 	__organize__: true, 
                       	// 	__info__: false, 
                       	// 	__type__: 'department', 
                       	// }, 
                       	{ 
                       		name: '销售方名称', 
                       		DateField: '', 
                       		field: 'sales_man_id', 
                       		tag: 'xjr-select-user', 
                       		avueType: 'null', 
                       		lgmark: '', 
                       		__organize__: true, 
                       		__info__: false, 
                       		__type__: 'user', 
                       	}, 
                       	{ 
                       		name: '销售合同名称', 
                       		DateField: '', 
                       		field: 'contract_name', 
                       		tag: 'el-input', 
                       		avueType: 'input-tip', 
                       		lgmark: '', 
                       	}, 
                       	{ 
                       		name: '服务开始日期', 
                       		DateField: '', 
                       		field: 'contract_start_date', 
                       		tag: 'el-date-picker', 
                       		avueType: 'datetime', 
                       		lgmark: '', 
                       		"type": "date",
                       		"format": "yyyy-MM-dd",
                       		"value-format": "yyyy-MM-dd",
                       	}, 
                       	{ 
                       		name: '服务结束日期', 
                       		DateField: '', 
                       		field: 'contract_end_date', 
                       		tag: 'el-date-picker', 
                       		avueType: 'datetime', 
                       		lgmark: '', 
                       		"type": "date",
                       		"format": "yyyy-MM-dd",
                       		"value-format": "yyyy-MM-dd",
                       	}, 
                       	{ 
                       		name: '含税金额', 
                       		DateField: '', 
                       		field: 'tax_amount', 
                       		tag: 'el-input', 
                       		avueType: 'input', 
                       		lgmark: '', 
                       		isFinance: true,
                       	}, 
                       	{ 
                       		name: '不含税金额', 
                       		DateField: '', 
                       		field: 'none_tax_amount', 
                       		tag: 'el-input', 
                       		avueType: 'input', 
                       		lgmark: '', 
                       		isFinance: true,
                       	}, 
                       	// { 
                       	// 	name: '合同主要内容说明', 
                       	// 	DateField: '', 
                       	// 	field: 'contract_instruction', 
                       	// 	tag: 'el-input', 
                       	// 	avueType: 'textarea', 
                       	// 	lgmark: '', 
                       	// }, 
                       	// { 
                       	// 	name: '其他说明', 
                       	// 	DateField: '', 
                       	// 	field: 'commentss', 
                       	// 	tag: 'el-input', 
                       	// 	avueType: 'input-tip', 
                       	// 	lgmark: '', 
                       	// }, 
                       	{ 
                       		name: '审阅结果', 
                       		DateField: '', 
                       		field: 'audit_state', 
                       		tag: 'el-checkbox-group', 
                       		avueType: 'checkbox', 
                       		lgmark: '', 
                       		dataType: 'dataItem', 
                       		dataItem: 'usersex', 
                       	}, 
                       	{ 
                       		name: '审阅人', 
                       		DateField: '', 
                       		field: 'auditor_id', 
                       		tag: 'xjr-select-user', 
                       		avueType: 'null', 
                       		lgmark: '', 
                       		__organize__: true, 
                       		__info__: false, 
                       		__type__: 'user', 
                       	}, 
                       	{ 
                       		name: '审核日期', 
                       		DateField: '', 
                       		field: 'audit_date', 
                       		tag: 'el-date-picker', 
                       		avueType: 'datetime', 
                       		lgmark: '', 
                       		"type": "date",
                       		"format": "yyyy-MM-dd",
                       		"value-format": "yyyy-MM-dd",
                       	}, 
                       	// { 
                       	// 	name: '不通过原因', 
                       	// 	DateField: '', 
                       	// 	field: 'reject_reason', 
                       	// 	tag: 'el-input', 
                       	// 	avueType: 'input-tip', 
                       	// 	lgmark: '', 
                       	// }, 
                       	// { 
                       	// 	name: '合同状态', 
                       	// 	DateField: '', 
                       	// 	field: 'contract_state', 
                       	// 	tag: 'el-input', 
                       	// 	avueType: 'input-tip', 
                       	// 	lgmark: '', 
                       	// }, 

                       ]
                       this.getSystemSearchList(querySearchData);
                       if(this.btns.length>0){
                       	let tempBtns =  this.btns.concat(oprBtns).filter((v) => this.btns.includes(v) && !oprBtns.includes(v));
                       	if(tempBtns.length>0){
                       		this.searchBtns  = [...new Set([...tempBtns])];
                       	}
                       }
                   },
                   methods: {
                         handleRowDBLClick (row, event) {
                         	if(this.hasBtns('service_contract:modify')&&this.hasButtonPermission('service_contract:modify')&&this.openDoubleClickEdit){
                         		this.editForm(row)
                         	}
                         },
                         handleCurrentRowChange(row){
                         	this.$refs.service_contractTable.toggleSelection([row]);
                         },
                         printForm() {
                         	let element = window.document.getElementById("printTable");
                         	setTimeout(() => {
                         	  html2canvas(element, {
                         		backgroundColor: null,
                         		useCORS: true,
                         		windowHeight: document.body.scrollHeight
                         	  }).then(canvas => {
                         		const url = canvas.toDataURL();
                         		this.printImg = url;
                         		printJS({
                         		  printable: url,
                         		  type: "image",
                         		  documentTitle: '打印',
                         		  scanStyles: false,
                         		  repeatTableHeader: false,
                         		  header: null
                         		});
                          	  });
                         	}, 1);
                           },
                         hasBtns(encode){
                         	return this.btns.includes(encode);
                         },
                         /**发起流程 */
                         CreateDesignFlow(val) {
                            this.createFlowType = 0;
                            this.scopeRow = val;
                            this.changeSystemSchemeInfo();
                         },
                         CreateFormFlow(val) {
                            this.createFlowType = 1;
                            this.scopeRow = val;
                            this.isCreateFlow = true;
                         },
                         /* 获取公司用户数据 */
                         getListData() {
                         	if(!this.searchParam.order){
                         		this.searchParam.orderfield = this.defaultOrderfield;
                         		this.searchParam.order = this.defaultOrder;
                         	}
                            let params = this.changeSearchParams();
                            request({
                                url: baseUrl + '/service_contract',
                                method: 'get',
                                params: params
                            }).then(res =>{
                                this.listData = res.data.data.Rows
                                this.page.total = res.data.data.Total;
                            })
                         },
                         /* 页面加载 */
                         onPageLoad(page) {
                            this.searchParam.limit = page.currentPage;
                            this.searchParam.size = page.pageSize;
                            this.getListData();
                         },
                          /*查看*/
                         viewForm(val) {
                           this.flag = true;
                           this.isEdit = false;
                           this.disabled = true;
                           this.keyValue = val.id; 
                         },
                          /* 编辑 */
                         editForm(val) {
                           this.flag = true; 
                           this.isEdit = true;
                           this.disabled = false;
                           this.keyValue = val.id; 
                         },
                          /* 打开表单 */
                         openForm(){
							  if(!this.isWorkflowForm){
                             //不处理工作流表单时候，表单类型重置
                             window.localStorage.setItem('systemFormType',0);
                           }
                           this.disabled = false;
                           this.keyValue = null; 
                           this.flag = true; 
                           this.isEdit = true; 
                         },
                          /* 删除 */
                         deleteForm(val) {
                            this.$confirm(this.$t("deletePrompt.promptContent"), this.$t("tip"), {
                              confirmButtonText: this.$t("buttonModule.modalSureBtn"),
                              cancelButtonText: this.$t("editorModule.cancel"),
                              type: "warning",
                             }).then(() => {
                                 request({
                                     url: baseUrl + "/service_contract/" + val.id,
                                     method: "delete",
                                 }).then((res) => {
                                     this.getListData()
                                     this.$notify({
                                      title: this.$t("Notice.hintSuccess"),
                                      message: this.$t("deletePrompt.successDeleted"),
                                      type: "success",
                                     });
                                 });
                             });
                         },
                          /* 分页 */
                         sortChange(data) {
                         	if(data.order){
                         		let order= getOrder(data.order);
                         		this.searchParam.order = order;
                         		this.searchParam.orderfield = data.prop;
                         	}else{
                         		this.searchParam.order = this.defaultOrder;
                         		this.searchParam.orderfield = this.defaultOrderfield;
                         	}
                         	this.getListData()
                         },
                          /* 弹窗回调 */
                          dialogChange(b){
                              this.flag = false;
                              this.$nextTick(()=>{
                              this.getListData();
                         })},
                          /* 查询 */
                           searchClick(params) {
                            this.page.currentPage=1;
                            this.searchParam.limit = 1;
                            this.searchParam.size = this.page.pageSize;
                            this.searchParam = params;
                            this.getListData()
                         },
                           /* 查询表单重置 */
                           searchReset() {
                            for (const key in this.searchParam) {
                                 if(this.searchParam[key]){
                                     this.searchParam[key] = null;
                                 }
                            }
                            this.page.currentPage=1;
                            this.searchParam.limit = 1;
                            this.searchParam.size = this.page.pageSize;
                            this.getListData();
                         },
                           selectionChange(list){
                             this.ids = list.map((x) => x.id).join(',');
                           },
                           batchDelete() {
                            if (!this.ids || this.ids.split(",").length === 0) {
                                 this.$message.error(this.$t("deletePrompt.noSelected"));
                                 return;
                           }
                             this.$confirm(this.$t("deletePrompt.promptContent"), this.$t("tip"), {
                               confirmButtonText: this.$t("buttonModule.modalSureBtn"),
                               cancelButtonText: this.$t("editorModule.cancel"),
                               type: "warning",
                             }).then(() => {
                               request({
                                 url: baseUrl + "/service_contract/" + this.ids,
                                 method: "delete",
                               }).then((res) => {
                                 this.getListData();
                                 this.$notify({
                                   title: this.$t("Notice.hintSuccess"),
                                   message: this.$t("deletePrompt.successDeleted"),
                                   type: "success",
                                 });
                               });
                             });
                           },
         }
     }
</script>
<style scoped>
.searchBox {
   width: calc(100% - 218px);
   display: inline-block;
}
.main-container{
   height: 100%!important;
   padding: 0 8px!important;
}
div /deep/ .custom-tree-node span{
   font-size: 14px;
   padding-left: 10px;
}
div /deep/ .custom-tree-node i{
   font-size: 12px;
}
div /deep/ .el-dialog__body{
height: 70vh;
overflow: scroll;
}
</style>
